import React, { useEffect, useState } from 'react';
import useStore from '../../../context/useStore';
import { useHistory } from 'react-router-dom'
import './PaperDetail.module.scss'
const PaperDetail: React.FC = () => {
    let { exam } = useStore();
    const [datas, setdata] = useState<any>([])
    useEffect(() => {
        setdata(exam.addExamAction)
    }, [exam])
    let history = useHistory();
    function eaxmBtn() {
        history.push('/home/paperList')
    }
    return (
        <div>
            <h2>创建试卷</h2>
            <div className='exam-box'>
                <button className='addExamBtn'>添加新题</button>
                <div className='tap'>
                    <p>{datas.title}</p>
                    <p>考试时间：<span></span>监考人：<span>{datas.user_id}</span>开始考试时间：<span></span> 阅卷人：<span>{datas.user_id}</span></p>
                </div>
                <div>
                    {(datas.questions as any) && datas.questions.map((item: any, index: number) => {
                        return <div key={index} className='content-box'>
                            <p>{index + 1}:{item.title}</p>
                            <p>{item.questions_stem}</p>
                            <p>{item.questions_answer}</p>
                            <p>{item.json_path}</p>
                            <p>{item.questions_type_text}</p>
                            <p>{item.subject_text}</p>
                        </div>
                    })}
                </div>
            </div>
            <button onClick={eaxmBtn}>创建试题</button>
        </div>
    );
}

export default PaperDetail;
